import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image } from '@tarojs/components'
import { AtTag } from 'taro-ui'
import './aolideDoc.scss'
import touxiang from '../../img/touxiang3.png'
import star from '../../img/star.png'
import app from '../../main'

export default class AolideDoc extends Component {

    config = {
        navigationBarTitleText: ''
    }
    constructor() {
        super(...arguments)
        this.state = {
            docInfo: [
            ]
        }
    }

    offect = 0;
    length = 25;
    total = 0;
    isFinlsh = false;

    //跳转到医生主页
    gotoDoctorindex(id) {
        app.navigateTo('../doctorindex/doctorindex?id='+id);
    }

    //上拉加载
    onReachBottom() {
        if ((this.offect + this.length) < this.total) {
            app.toast('正在加载----')
            this.offect = this.offect + this.length;
            this.isFinlsh = false;
            //调用接口
             this.getDate();
        } else {
            app.toast('没有更多数据了咯')
            this.isFinlsh = true;
        }
    }

    getDate(){
        let me = this
        let docArray=[]
        let data = {offset:this.offect,length:this.length,hospital:this.$router.params.title}
        app.post('web/members/doctorList',data,function(res){
            docArray = me.state.docInfo.concat(res.data.result.list)
            me.total  = res.data.result.total
            me.setState({
                docInfo:docArray
            })
        })
    }
    componentDidMount(){
        this.getDate();
        Taro.setNavigationBarTitle({
            title:this.$router.params.title
        })
    }


    render() {
        // 医生数据
        let infoList = this.state.docInfo.map((item) => {
            return <View className='docInfo' onClick={this.gotoDoctorindex.bind(this,item.id)}>
                <View>
                    <Image
                        className='avider'
                        src={item.head_image}
                    />
                </View>
                <View className='infoText'>
                    <View className='textTile'>
                        <View>
                            <Text className='name'>{item.name}</Text>
                            <Text className='t'>{item.positional_title}</Text>
                        </View>
                        <View>
                            <Image className='starStyle' src={star} />
                            <Text className='tn'>{item.general_score}</Text>
                        </View>
                    </View>
                    <View ><Text>{item.hospital}</Text></View>
                    <View className='googAt'>
                        <Text>擅长：{item.speciality}</Text>
                    </View>
                    {/* 标签遍历输出 */}
                    <View className='infoTag'>
                        {item.labels.map((item2) => {
                            return <View>
                                <AtTag className='tag' circle>
                                    {item2}
                                </AtTag>
                            </View>
                        })}
                    </View>
                </View>
            </View>
        })

        let nofount = <View className='nofountDoc'>暂无医生顾问</View>
        return (
            <View>
                {this.state.docInfo.length == 0 ? nofount : infoList}
            </View>
        )
    }
}